<template>
	<view class="content">
		<!-- 空白页 -->
		<empty v-if="orderList.length === 0"></empty>
		<!-- 订单列表 -->
		<view v-for="(item,index) in orderList" :key="index" class="padding text-center">
			<view @click="navigaTo(item.id)" class="padding-xs radius shadow-warp bg-white margin-top">
				<view class="text-left padding-xs">
					<text>取餐号码：</text>
					<text class="order-right text-bold">{{item.mealNo}}</text>
				</view>
				<view class="text-left padding-xs">
					<text>桌号：</text>
					<text class="order-right">{{item.position}}</text>
				</view>
				<view class="text-left padding-xs">
					<text>下单时间：</text>
					<text class="order-right">{{item.addTime}}</text>
				</view>
				<view class="text-left padding-xs">
					<text>订单金额：</text>
					<text class="order-right text-red">￥{{item.goodsPrice}}</text>
				</view>
				<view class="text-left padding-xs">
					<text>订单状态：</text>
					<text v-if="item.orderStatus===1" class="order-right text-yellow">等待商家确认</text>
					<text v-if="item.orderStatus===2" class="order-right text-green">商家已确认</text>
					<text v-if="item.orderStatus===3" class="order-right text-blue">已完成</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import empty from "@/components/empty";
	import orderapi from '../../api/order.js'
	export default {
		components: {
			empty
		},
		data() {
			return {
				orderList: []
			};
		},
		onShow() {
			this.getmyorders()
		},

		methods: {
			navigaTo(id) {
				uni.navigateTo({
					url: '/pages/order/orderDetail?id=' + id
				})
			},
			getmyorders() {
				uni.showLoading({
					title: '请求中...'
				})
				orderapi.getList({
					success: res => {
						if (res.data.code === 0) {
							this.orderList = res.data.data
						}
						if (res.data.code === 401) {
							uni.navigateTo({
								url: '../public/wxlogin'
							})
						}
						uni.hideLoading()
					},
					fail: err => {
						uni.hideLoading()
						uni.showToast({
							title: '请求失败',
							duration: 1500
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.order-right {
		float: right;
		padding-right: 10rpx;
	}
</style>
